<template>
  <div class="table-wrap">
    <div class="table-content">
      <div class="table-add-btn">
        <span>共{{ pageDatasource?.length }}场景模型</span>
      </div>

      <Table :columns="pageColumns" :data-source="pageDatasource" :pagination="false" row-key="id" :loading="loading">
        <template #bodyCell="{ column, record }">

          <template v-if="column.key === 'scene'">
            <div> {{ record.sceneJson?.name || '--' }} </div>
          </template>

          <template v-if="column.key === 'useModel'">
            <div class="flex flex-col">
              <Radio v-for="item in record.items" :value="item.id" v-model:checked="item.isEnable"
                @change="handleModelChange(item)">{{ item.modelName || '--' }}</Radio>
            </div>
          </template>

          <template v-if="column.key === 'updateTime'">
            <span>{{ convertTime(record.updateTime, 'YYYY-MM-DD HH:mm') }}</span>
          </template>
          <template v-if="column.key === 'loginIp'">
            <span>{{ record.loginIp ?? '--' }}</span>
          </template>

          <template v-if="column.key === 'action'">
            <Button class="!px-0 !mr-6" type="link" @click="modelManage(record)">模型管理</Button>
          </template>

        </template>
      </Table>
    </div>
    <AddAccountModal ref="addRef" @ok="getAccountList" />
  </div>
</template>

<script lang="ts" setup name="AccountIndex">
import { ref } from 'vue'
import { pageColumns } from './index'
import { Button, Table, message, Radio } from 'ant-design-vue'
import AddAccountModal from './addAccountModal.vue'
import { ModelApi, SettingModelResult, SettingModelGroupResult } from '@/api'
import { convertTime } from '@/utils/queryConversion'

const loading = ref(false)
const pageDatasource = ref<SettingModelResult[]>()
// 添加账号
const addRef = ref();

const getAccountList = async () => {
  loading.value = true;
  try {
    let res = await ModelApi.modelConfigs();
    pageDatasource.value = res;
  } catch (error) {

  } finally {
    loading.value = false;
  }
}

onMounted(() => {
  getAccountList();
})

const modelManage = (item: SettingModelGroupResult) => {
  addRef.value.handleOpen(item);
}

const handleModelChange = async (data: SettingModelResult) => {
  loading.value = true;
  try {
    await ModelApi.modelEnablemodel(data.id!.toString());
    message.success('启用成功')
    getAccountList()
  } catch (error) {

  } finally {
    loading.value = false;
  }
}
</script>

<style lang="less" scoped></style>